

const shallowRef = (val) => {
    return shallowReactive({ value: val })
}

//循环第一层数据变成响应式  只有第一层被proxy添加get  set
const shallowReactive = (obj) => {
    return new Proxy(obj, {
        get(obj, key) {
            return obj[key]
        },
        set(obj, key, newVal) {
            obj[key] = newVal
            console.log("页面更新了");
            return true
        }
    })
}

let state = shallowRef({ name: 'zjq', age: 16, habby: { habby1: '足球' } })
state.value.name = 'zrh'
console.log(state, '=== 1 ===');
state.value = { name: "12345" }
console.log(state, '=== 2 ===');
// let state = shallowReactive({ name: 'zjq', age: 16, habby: { habby1: '足球' } })
// state.name = 'zrh'
// console.log(state, '=== 1 ===');
// state.habby.habby1 = "跑步" //没有触发更新
// console.log(state, '=== 2 ===');